<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        //使用箭头函数来定义函数

        //1、声明一个函数
        //之前的声明
        let result = function(a,b){
            return a+b;
        }
        console.log(result(1,2));  //3

        //箭头函数声明
        let res = (a,b) =>{
            return a + b;
        }
        console.log(res(1,2));  //3

        //2、箭头函数中的this是静态的，this始终指向函数声明时所在作用域下的this 的值
        //传统函数
        function fun(){
            console.log(this.name);
        }
        //箭头函数
        let fun2 = () =>{
            console.log(this.name);
        }

        //设置window对象里面的  name属性
        window.name="hello";
        //设置对象中的 name属性
        const obj = {
            name:'HELLO'
        }

        //直接调用  此时都是指向全局中的hello
        fun();
        fun2();

        //通过call方法改变这个this的指向
        fun.call(obj);  //这个指向了对象中的name
        fun2.call(obj);  //这个还是全局下的name

        //3、箭头函数不能作为构造实例化对象
        // let Person = (name,age) => {
        //     this.name = name;
        //     this.age = age;
        // }
        // let me = new Person('xiao',30);
        // console.log(me); //这样会报错

        //4、不能使用arguments 变量
        // function fun(){
        //     console.log(arguments);
        // }
        let funs = () =>{
            console.log(arguments);
        }

        //4、箭头函数的简写
        //(1)、当形参只有一个时候，小括号可以省略；当执行语句只有一句的时候，大括号可以省略，如果有return 的话，return要省略掉
        let adds = a => a*a;
        console.log(adds(9));


    </script>
</body>
</html>